<template>
  <div class="son-component-body">
    <!-- 我是第{{ messageId }}个组件
    <ul>
      <li>我的名字是{{ messageUname }}</li>
      <li>我的姓是{{ messageFamliyName }}</li>
      <li>我的年龄是{{ messageAge }}</li>
      <li>我的职业是{{ messageProfess }}</li>
    </ul> -->
    我是第{{ message.id }}个组件
    <ul>
      <li>我的名字是{{ message.uname }}</li>
      <li>我的姓是{{ message.famliyName }}</li>
      <li>我的年龄是{{ message.age }}</li>
      <li>我的职业是{{ message.profess }}</li>
      <li><button @click="btn">过了一年</button></li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'SonComponent',

  // props: [
  //   'messageUname',
  //   'messageFamliyName',
  //   'messageAge',
  //   'messageProfess',
  //   'messageId',
  // ],

  props: ['message'],

  data() {
    return {}
  },

  methods: {
    btn() {
      this.$emit('nianLing', this.message.id)
    },
  },
}
</script>

<style scoped>
.son-component-body {
  width: 300px;
  height: 200px;
  border: 3px solid #333;
}
</style>
